// 假设我们有一个需要权限控制的按钮组件
const PermissionButton = ({ label, requiredRole, onClick }) => {
    const { userRole } = useContext(AuthContext);

    return hasPermission(requiredRole, userRole) ? (
        <button onClick={onClick}>{label}</button>
    ) : (
        <span>无权访问</span>
    );
};

// 使用权限按钮组件
const SomeComponent = () => {
    const handleClick = () => {
        // 执行按钮点击时的逻辑
    };

    return (
        <div>
            <h1>一些组件</h1>
            {/* 仅当用户具有 USER 或 ADMIN 权限时显示按钮 */}
            <PermissionButton label="点击我" requiredRole="USER" onClick={handleClick} />
        </div>
    );
};
